
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>WEB打印控件LODOP的样例二十三:水平或垂直方向居中打印超文本</title>
<script language="javascript" src="LodopFuncs.js"></script>
<link rel="stylesheet" href="test.css">
<link rel="stylesheet" href="test1.css">
</head>
<body>
<div id="dv1" style="">
   <div id="dv10" style="">
    <div id="dv11" style=""></div>
    <div id="dv22" style=""></div>
    <textarea name="" id="" cols="30" rows="10" ></textarea>
    <img src='http://pic4.nipic.com/20091217/3885730_124701000519_2.jpg' style="width: 50px;height: 60" alt="">
<form valign="center" >
 <input id="inpt112" type="text" value="A001">
  <table border="2" width="400" height="106" cellspacing="1" bgcolor="#CCFFFF"  style="border:solid 2px black">
  <tr>
  <td width="60" height="16" align="center" style="border:solid 1px black"><font color="#0000FF">A</font><font color="#0000FF">等</font></td>
  <td width="60" height="16" align="center" style="border:solid 1px black"><font color="#0000FF">B</font><font color="#0000FF">等</font></td>
  <td width="60" height="16" align="center" style="border:solid 1px black"><font color="#0000FF">C</font><font color="#0000FF">等</font></td>
  <td width="100" height="16" align="center" style="border:solid 1px black"><font color="#0000FF">D</font><font color="#0000FF">等</font></td>
  </tr> 
  <tr>
  <td  height="50" style="border:solid 1px black" ><input id="inpt1" type="text" value="A001"></td>
  <td  height="12" style="border:solid 1px black" valign="middle" align="middle">B001</td>
  <td  height="12" style="border:solid 1px black"><INPUT name=powerlist value=1 type=checkbox>C001</td>
  <td  height="16" align="center" style="border:solid 1px black">
    <input type="radio" id="R1" name="RX" checked>D1号<br>
    <input type="radio" id="R2" name="RX">D2号<br>
    <input type="radio" id="R3" name="RX">D3号<br>
  </td>
  </tr> 
  <tr>
  <td  height="16" style="border:solid 1px black"><input id="inpt2" type="text" style="background-color:Transparent" value="A002"></td>
  <td  height="16" style="border:solid 1px black">B002</td>
  <td  height="16" style="border:solid 1px black"><INPUT name=powerlist value=1 type=checkbox  checked>C002</td>
  <td   height="16" align="center" style="border:solid 1px black">
    <input type="radio" id="R1" name="RX1" checked>D1号<br>
    <input type="radio" id="R2" name="RX1">D2号<br>
    <input type="radio" id="R3" name="RX1">D3号<br>
  </td>
  </tr> 
  <tr>
  <td  height="16" style="border:solid 1px black"><input id="inpt3" type="text" style="border:none;background-color:Transparent;" value="A003"></td>
  <td  height="16" style="border:solid 1px black">
  <select size="1" name="D1">
  <option value="a">B003-A</option>
  <option value="b" selected>B003-B</option>
  <option value="c">B003-C</option>
  </select></td>
  <td  height="16" style="border:solid 1px black"><INPUT name=powerlist value=1 type=checkbox>C003</td>
  <td   height="16" align="center" style="border:solid 1px black">
    <input type="radio" id="R1" name="RX2" checked>D1号<br>
    <input type="radio" id="R2" name="RX2">D2号<br>
    <input type="radio" id="R3" name="RX2">D3号<br>
  </td>
</tr> 
</table>
</form>    
    </div> 
</div>            
<a href="javascript:myDesign1()">打印设计1</a>        
<script>
function refreshData(){ //让innerHTML获取的内容包含input和select(option)的最新值
    var allInputObject=document.body.getElementsByTagName("input");
    for (i = 0; i < allInputObject.length; i++) {
        if(allInputObject[i].type=="checkbox")  {
                if (allInputObject[i].checked ) 
                    allInputObject[i].setAttribute("checked","checked"); 
                    else
                    allInputObject[i].removeAttribute("checked");
        } else 	if(allInputObject[i].type=="radio")  {
                if (allInputObject[i].checked ) 
                    allInputObject[i].setAttribute("checked","checked"); 
                    else
                    allInputObject[i].removeAttribute("checked");
        }else allInputObject[i].setAttribute("value",allInputObject[i].value);
    };
    for (i = 0; i < document.getElementsByTagName("select").length; i++) {
        var sl=document.getElementsByTagName("select")[i];
        for (j = 0; j < sl.options.length; j++) {
        if (sl.options[j].selected) 
                    sl.options[j].setAttribute("selected","selected");
        else sl.options[j]=new Option(sl.options[j].text,sl.options[j].value);
        };
    };
}; 
var LODOP; //声明为全局变量                     
function  myDesign1(){   
    refreshData();                  
    LODOP=getLodop();                       
    /*LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_文本居中一");  
    
    var strStyleCSS="<link href='test.css' type='text/css' rel='stylesheet'>";
    LODOP.ADD_PRINT_HTM(90,221,"106.76mm",245,strStyleCSS+"<body>"+document.getElementById("dv1").innerHTML+"</body>");  //宽120mm                     
    LODOP.SET_PRINT_STYLEA(0,"Horient",2);                     
    LODOP.PRINT_DESIGN();*/
    
    var strStyleCSS="<link href='test.css' type='text/css' rel='stylesheet'><link href='test1.css' type='text/css' rel='stylesheet'>";
    var strFormHtml=strStyleCSS+"<body>"+document.getElementById("dv1").innerHTML+"</body>";
    LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_外链样式风格");
    LODOP.ADD_PRINT_TEXT(50,50,260,39,"外链样式双线边框：");
    LODOP.ADD_PRINT_HTM(0,0,300,700,strFormHtml);
    LODOP.PREVIEW();
};    
</script>           
</body>                     
</html>